<template>
  <a-card title="缝制传票打印系统">
    <div slot="extra">
      <a-button icon="desktop" @click="design"> 设计 </a-button>
      <a-button icon="setting" @click="setup"> 设置 </a-button>
      <a-button icon="search" @click="preview"> 预览 </a-button>
      <a-button type="primary" icon="printer" @click="print"> 打印 </a-button>
    </div>
    <a-form-model :model="form" layout="horizontal" :labelCol="{ span: 5 }">
      <a-row>
        <a-col :span="24"><h2>缝制传票</h2></a-col>
      </a-row>
      <a-row>
        <a-col :span="6">
          <a-form-model-item label="#">
            <a-input v-model="form.id" placeholder="格式:HL239923889321-129" />
          </a-form-model-item>
        </a-col>
        <a-col :span="12"></a-col>
        <a-col :span="6">
          <a-form-model-item label="日期">
            <a-date-picker v-model="form.riqi" />
          </a-form-model-item>
        </a-col>
      </a-row>
      <a-row>
        <a-col :span="6">
          <a-form-model-item label="合同号">
            <a-input v-model="form.hetonghao" />
          </a-form-model-item>
        </a-col>
        <a-col :span="6">
          <a-form-model-item label="全板总量">
            <a-input
              v-model="form.quanbanzongliang"
              placeholder="多个用#隔开！如：6#2#4"
            />
          </a-form-model-item>
        </a-col>
        <a-col :span="6">
          <a-form-model-item label="份数">
            <a-input
              v-model="form.quanbanzongliang.split('#').length"
              :disabled="true"
            />
          </a-form-model-item>
        </a-col>
        <a-col :span="6">
          <a-form-model-item label="裁剪工">
            <a-input v-model="form.caijiangong" />
          </a-form-model-item>
        </a-col>
      </a-row>
      <a-row>
        <a-col :span="6">
          <a-form-model-item label="品名">
            <a-input v-model="form.pinming" />
          </a-form-model-item>
        </a-col>
        <a-col :span="6">
          <a-form-model-item label="收边">
            <a-input v-model="form.shoubian" />
          </a-form-model-item>
        </a-col>
        <a-col :span="6">
          <a-form-model-item label="合缝">
            <a-input v-model="form.fenghe" />
          </a-form-model-item>
        </a-col>
        <a-col :span="6">
          <a-form-model-item label="上松紧带">
            <a-input v-model="form.shangsongjindai" />
          </a-form-model-item>
        </a-col>
      </a-row>
      <a-row>
        <a-col :span="6">
          <a-form-model-item label="货号">
            <a-input v-model="form.huohao" />
          </a-form-model-item>
        </a-col>
        <a-col :span="6">
          <a-form-model-item label="合肩">
            <a-input v-model="form.hejian" />
          </a-form-model-item>
        </a-col>
        <a-col :span="6">
          <a-form-model-item label="四针">
            <a-input v-model="form.sizhen" />
          </a-form-model-item>
        </a-col>
        <a-col :span="6">
          <a-form-model-item label="合衩">
            <a-input v-model="form.hecha" />
          </a-form-model-item>
        </a-col>
      </a-row>
      <a-row>
        <a-col :span="6">
          <a-form-model-item label="规格">
            <a-input v-model="form.guige" />
          </a-form-model-item>
        </a-col>
        <a-col :span="6">
          <a-form-model-item label="包领边">
            <a-input v-model="form.baolingbian" />
          </a-form-model-item>
        </a-col>
        <a-col :span="6">
          <a-form-model-item label="包衩">
            <a-input v-model="form.baocha" />
          </a-form-model-item>
        </a-col>
        <a-col :span="6">
          <a-form-model-item label="平板">
            <a-input v-model="form.pingban" />
          </a-form-model-item>
        </a-col>
      </a-row>
      <a-row>
        <a-col :span="6">
          <a-form-model-item label="色号">
            <a-input v-model="form.sehao" />
          </a-form-model-item>
        </a-col>
        <a-col :span="6">
          <a-form-model-item label="包袖">
            <a-input v-model="form.baoxiu" />
          </a-form-model-item>
        </a-col>
        <a-col :span="6">
          <a-form-model-item label="包脚口">
            <a-input v-model="form.baojiaokou" />
          </a-form-model-item>
        </a-col>
        <a-col :span="6">
          <a-form-model-item label="拉条">
            <a-input v-model="form.latiao" />
          </a-form-model-item>
        </a-col>
      </a-row>
      <a-row>
        <a-col :span="6">
          <a-form-model-item label="数量">
            <a-input v-model="form.shuliang" :disabled="true" />
          </a-form-model-item>
        </a-col>
        <a-col :span="6">
          <a-form-model-item label="合袖">
            <a-input v-model="form.hexiu" />
          </a-form-model-item>
        </a-col>
        <a-col :span="6">
          <a-form-model-item label="撸腰">
            <a-input v-model="form.luyao" />
          </a-form-model-item>
        </a-col>
        <a-col :span="6">
          <a-form-model-item label="备注">
            <a-input v-model="form.beizhu" />
          </a-form-model-item>
        </a-col>
      </a-row>
      <a-row>
        <a-col :span="6">
          <a-form-model-item label="锅号">
            <a-input v-model="form.guohao" />
          </a-form-model-item>
        </a-col>
        <a-col :span="6">
          <a-form-model-item label="打结">
            <a-input v-model="form.dajie" />
          </a-form-model-item>
        </a-col>
        <a-col :span="6">
          <a-form-model-item label="订标">
            <a-input v-model="form.dingbiao" />
          </a-form-model-item>
        </a-col>
      </a-row>
    </a-form-model>
  </a-card>
</template>

<script>
import moment from "moment";

export default {
  name: "Home",
  data() {
    return {
      LODOP: null,
      form: {
        riqi: moment(),
        hetonghao: "",
        pinming: "",
        id: "",
        huohao: "",
        guige: "",
        sehao: "",
        shuliang: "",
        guohao: "",
        caijiangong: "",
        quanbanzongliang: "",
      },
    };
  },

  methods: {
    initlodop() {
      if (!this.LODOP) {
        // eslint-disable-next-line no-undef
        this.LODOP = getLodop();
      }
      this.LODOP.SET_PRINT_PAGESIZE(0, 1894, 931, "缝制传票");
    },
    design() {
      this.initlodop();
      this.LODOP.SET_SHOW_MODE("BKIMG_PRINT", 1); //打印包含背景图
      this.LODOP.ADD_PRINT_SETUP_BKIMG("C:\\bg.jpg");
      this.LODOP.SET_SHOW_MODE("BKIMG_LEFT", 0);
      this.LODOP.SET_SHOW_MODE("BKIMG_TOP", 0);
      this.LODOP.SET_SHOW_MODE("BKIMG_WIDTH", "189.44mm");
      this.LODOP.SET_SHOW_MODE("BKIMG_HEIGHT", "93.1mm");

      this.LODOP.ADD_PRINT_TEXT("5mm", "14mm", "26.46mm", "5.29mm", "ID");
      this.LODOP.ADD_PRINT_TEXT(
        "16.01mm",
        "14mm",
        "26.46mm",
        "5.29mm",
        "合同号"
      );
      this.LODOP.ADD_PRINT_TEXT("24.05mm", "14mm", "26.46mm", "5.29mm", "品名");
      this.LODOP.ADD_PRINT_TEXT("32.99mm", "14mm", "26.46mm", "5.29mm", "货号");
      this.LODOP.ADD_PRINT_TEXT("41.01mm", "14mm", "26.46mm", "5.29mm", "规格");
      this.LODOP.ADD_PRINT_TEXT("50.51mm", "14mm", "26.46mm", "5.29mm", "色号");
      this.LODOP.ADD_PRINT_TEXT("58.31mm", "14mm", "26.46mm", "5.29mm", "数量");
      this.LODOP.ADD_PRINT_TEXT("67.5mm", "14mm", "26.46mm", "5.29mm", "锅号");
      this.LODOP.ADD_PRINT_TEXT(
        "16.01mm",
        "60.4mm",
        "23.55mm",
        "5.29mm",
        "全版总量"
      );
      this.LODOP.ADD_PRINT_TEXT(
        "16.01mm",
        "99.56mm",
        "22.49mm",
        "5.29mm",
        "份数"
      );
      this.LODOP.ADD_PRINT_TEXT(
        "16.01mm",
        "138.46mm",
        "26.46mm",
        "5.29mm",
        "裁剪工"
      );
      this.LODOP.ADD_PRINT_TEXT(
        "6.27mm",
        "138.46mm",
        "26.46mm",
        "5.29mm",
        "2022-01-18"
      );

      this.LODOP.PRINT_DESIGN();
    },
    setup() {
      this.initlodop();
      this.LODOP.SET_SHOW_MODE("BKIMG_PRINT", 1); //打印包含背景图
      this.LODOP.ADD_PRINT_SETUP_BKIMG("C:\\bg.jpg");
      this.LODOP.SET_SHOW_MODE("BKIMG_LEFT", 0);
      this.LODOP.SET_SHOW_MODE("BKIMG_TOP", 0);
      this.LODOP.SET_SHOW_MODE("BKIMG_WIDTH", "189.44mm");
      this.LODOP.SET_SHOW_MODE("BKIMG_HEIGHT", "93.1mm");

      this.LODOP.ADD_PRINT_TEXT("5mm", "14mm", "26.46mm", "5.29mm", "ID");
      this.LODOP.ADD_PRINT_TEXT(
        "16.01mm",
        "14mm",
        "26.46mm",
        "5.29mm",
        "合同号"
      );
      this.LODOP.ADD_PRINT_TEXT("24.05mm", "14mm", "26.46mm", "5.29mm", "品名");
      this.LODOP.ADD_PRINT_TEXT("32.99mm", "14mm", "26.46mm", "5.29mm", "货号");
      this.LODOP.ADD_PRINT_TEXT("41.01mm", "14mm", "26.46mm", "5.29mm", "规格");
      this.LODOP.ADD_PRINT_TEXT("50.51mm", "14mm", "26.46mm", "5.29mm", "色号");
      this.LODOP.ADD_PRINT_TEXT("58.31mm", "14mm", "26.46mm", "5.29mm", "数量");
      this.LODOP.ADD_PRINT_TEXT("67.5mm", "14mm", "26.46mm", "5.29mm", "锅号");
      this.LODOP.ADD_PRINT_TEXT(
        "16.01mm",
        "60.4mm",
        "23.55mm",
        "5.29mm",
        "全版总量"
      );
      this.LODOP.ADD_PRINT_TEXT(
        "16.01mm",
        "99.56mm",
        "22.49mm",
        "5.29mm",
        "份数"
      );
      this.LODOP.ADD_PRINT_TEXT(
        "16.01mm",
        "138.46mm",
        "26.46mm",
        "5.29mm",
        "裁剪工"
      );
      this.LODOP.ADD_PRINT_TEXT(
        "6.27mm",
        "138.46mm",
        "26.46mm",
        "5.29mm",
        "2022-01-18"
      );

      this.LODOP.PRINT_SETUP();
    },
    preview() {
      this.initlodop();
      this.LODOP.SET_SHOW_MODE("BKIMG_PRINT", 1); //打印包含背景图
      this.LODOP.ADD_PRINT_SETUP_BKIMG("C:\\bg.jpg");
      this.LODOP.SET_SHOW_MODE("BKIMG_LEFT", 0);
      this.LODOP.SET_SHOW_MODE("BKIMG_TOP", 0);
      this.LODOP.SET_SHOW_MODE("BKIMG_WIDTH", "189.44mm");
      this.LODOP.SET_SHOW_MODE("BKIMG_HEIGHT", "93.1mm");
      let quanbanzongliangTotal = 0;
      this.form.quanbanzongliang.split("#").forEach((val) => {
        quanbanzongliangTotal = quanbanzongliangTotal + parseInt(val);
      });
      this.form.quanbanzongliang.split("#").forEach((val, index) => {
        this.genpage(val, quanbanzongliangTotal, index + 1);
      });

      this.LODOP.PREVIEW();
    },
    print() {
      this.initlodop();
      let quanbanzongliangTotal = 0;
      this.form.quanbanzongliang.split("#").forEach((val) => {
        quanbanzongliangTotal = quanbanzongliangTotal + parseInt(val);
      });
      this.form.quanbanzongliang.split("#").forEach((val, index) => {
        console.log("quanbanzongliangTotal:"+quanbanzongliangTotal)
        this.genpage(val, quanbanzongliangTotal, index + 1);
        this.LODOP.PRINT();
      });
    },
    genpage(val, quanbanzongliangTotal, index) {
      this.LODOP.PRINT_INIT("缝制传票" + index);
      this.LODOP.SET_PRINT_PAGESIZE(0, 1894, 931, "缝制传票");
      this.LODOP.SET_PRINT_MODE("CREATE_CUSTOM_PAGE_NAME", "缝制传票"); //对新建的纸张重命名
      // this.LODOP.SET_PRINT_MODE("POS_BASEON_PAPER",true);

      this.LODOP.ADD_PRINT_TEXT(
        "5mm",
        "14mm",
        "26.46mm",
        "5.29mm",
        this.form.id
      );
      this.LODOP.ADD_PRINT_TEXT(
        "16.01mm",
        "14mm",
        "26.46mm",
        "5.29mm",
        this.form.hetonghao
      );
      this.LODOP.ADD_PRINT_TEXT(
        "24.05mm",
        "14mm",
        "26.46mm",
        "5.29mm",
        this.form.pinming
      );
      this.LODOP.ADD_PRINT_TEXT(
        "32.99mm",
        "14mm",
        "26.46mm",
        "5.29mm",
        this.form.huohao
      );
      this.LODOP.ADD_PRINT_TEXT(
        "41.01mm",
        "14mm",
        "26.46mm",
        "5.29mm",
        this.form.guige
      );
      this.LODOP.ADD_PRINT_TEXT(
        "50.51mm",
        "14mm",
        "26.46mm",
        "5.29mm",
        this.form.sehao
      );
      this.LODOP.ADD_PRINT_TEXT("58.31mm", "14mm", "26.46mm", "5.29mm", val);
      this.LODOP.ADD_PRINT_TEXT(
        "67.5mm",
        "14mm",
        "26.46mm",
        "5.29mm",
        this.form.guohao
      );
      this.LODOP.ADD_PRINT_TEXT(
        "16.01mm",
        "138.46mm",
        "26.46mm",
        "5.29mm",
        this.form.caijiangong
      );
      this.LODOP.ADD_PRINT_TEXT(
        "16.01mm",
        "60.4mm",
        "23.55mm",
        "5.29mm",
        quanbanzongliangTotal
      );
      this.LODOP.ADD_PRINT_TEXT(
        "16.01mm",
        "99.56mm",
        "22.49mm",
        "5.29mm",
        index + "/" + this.form.quanbanzongliang.split("#").length
      );
      this.LODOP.ADD_PRINT_TEXT(
        "6.27mm",
        "138.46mm",
        "26.46mm",
        "5.29mm",
        this.form.riqi.format("YYYY-MM-DD")
      );
    },
  },
  mounted() {
    this.initlodop();
  },
};
</script>

<style scoped>
.ant-form-item {
  display: flex !important;
}

.ant-form-item-control-wrapper {
  flex: 1 !important;
}

h2 {
  text-align: center;
}
button {
  margin-left: 10px !important;
}
</style>
